$(function(){
	
	var dropbox = $('#dropbox'),
		message = $('.message', dropbox);
	
	dropbox.filedrop({
		// The name of the $_FILES entry:
		paramname:'_file',
		
		maxfiles: 99,
    	maxfilesize: 1,
		url: drag_drop_url,
		
		uploadFinished:function(i,file,response){
			$.data(file).addClass('done');
//			response = eval("("+response+")");
			if (response.status == 1)
			{

				thumbShow(response.pic);
				//$("#imagesDiv").prepend("<div class='imgWrap'><img src='" + response.thumb+  "'/></div>");

			} else
			{
				$("#msg").prepend("<p>"+response.err+"</p>");
			}
			setTimeout(function(){
				$.data(file).hide(1000);
			},2000);
			// response is the JSON object that post_file.php returns
		},
		
    	error: function(err, file) {
			switch(err) {
				case 'BrowserNotSupported':
					showMessage('Your browser does not support HTML5 file uploads!');
					break;
				case 'TooManyFiles':
					alert('Too many files! Please select 5 at most! (configurable)');
					break;
				case 'FileTooLarge':
					alert(file.name+' is too large! Please upload files up to 2mb (configurable).');
					break;
				default:
					break;
			}
		},
		
		// Called before each upload is started
		beforeEach: function(file){		
			if(!file.type.match(/^image\//)){
				alert('Only images are allowed!');
				
				// Returning false will cause the
				// file to be rejected
				return false;
			}
		},
		
		uploadStarted:function(i, file, len){			
			createImage(file);
		},
		
		progressUpdated: function(i, file, progress) {
			$.data(file).find('.progress').width(progress);
		}
    	 
	});
	
	var template = '<div class="preview">'+
						'<div class="imgName">'+			
						'</div>'+
						'<div class="progressHolder">'+
							'<div class="progress"></div>'+
						'</div>'+						
						'<div class="uploaded">OK</div>'+
					'</div>'; 
	
	
	function createImage(file){
		var preview = $(template), 
			image = $('.imgName', preview);
		image.html(file.name);
		message.hide();
		preview.appendTo(dropbox);	
		$.data(file,preview);	
	}

	function showMessage(msg){
		message.html(msg);
	}

});